<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib prefix="mvc" uri="http://www.springframework.org/tags/form" %>
<%@taglib prefix="fmt" uri="http://www.springframework.org/tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="X-UA-Compatible" content="IE=10,chrome=1">
    <meta charset="utf-8">
    <title>试卷目录管理</title>
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/lims/layui-v2.4.5/layui/css/layui.css?20190817.1">
    <link rel="stylesheet" href="/lims/css/common.css">
    <link rel="stylesheet" href="/lims/css/eleTree.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/layui.css">
    <link rel="stylesheet" href="/lib/zTreeStyle/zTreeStyle.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/common.css">
    <link rel="stylesheet" href="/lib/layui/layui/css/eleTree.css">
    <script type="text/javascript" src="/js/jquery/jquery-1.9.1.js"></script>
    <script src="/lims/layui-v2.4.5/layui/layui.js"></script>
    <script src="/lib/jquery.form.min.js"></script>
    <script src="/lims/js/common.js?v=20190726" type="text/javascript" charset="utf-8"></script>
    <script src="/lims/js/baseCode/base.js?v=2019080918:09" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="/lims/layui/global.js"></script>
    <script src="/js/base/base.js" type="text/javascript" charset="utf-8"></script>
    <style>
        .layui-form-label{width:100px;}
        .layui-input-block{margin-left:130px;}
        .layui-disabled, .layui-disabled:hover{color: #797979 !important;}
    </style>
    <link rel="stylesheet" href="/lib/zTree_v3/css/zTreeStyle/zTreeStyle.css"/>
    <script type="text/javascript" src="/lib/zTree_v3/js/jquery.ztree.all.min.js"></script>
    <%--    <link rel="stylesheet" href="/duplopages/manage/standard/form/css/treeselect.css"/>--%>
    <script type="text/javascript" src="/lib/layui/layui/lay/dest/layui.all.js"></script>
    <script src="/lib/layui/layui/layui.js"></script>
    <script type="text/javascript" src="/lib/layui/layui/global.js/"></script>
    <script src="/lib/layui/layui/js/baseCode/base.js?v=2019080918:09" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="layui-fluid"  id="LAY-app-message">
    <div class="layui-row layui-col-space15">
        <div class="layui-lf" style="width: 250px;float: left;">
            <div class="layui-card" >
                <div class="layui-card-body panel-body tyid" style="height:600px;">
                    <div id="learnDirTree" class="eleTree ele1" lay-filter="data1" style="overflow:auto;height:100%"></div>
                </div>
            </div>
        </div>
        <div class="layui-rt" style="width: calc(100% - 285px);float: left;">
            <div class="layui-card">
                <div class="layui-card-header"><label id="nodePath"></label> </div>
                <div class="layui-card-body">
                    <script id="learnDirAction_Tpl" type="text/html">
                        <div class="LAY-learnDirAction-action-btns" style="margin-bottom: 10px;">
                            {{# layui.each(d.fields, function(index, field){}}
                            <button type="button" class="layui-btn layui-btn-primary layui-btn-sm {{#if(field.disabled==true){}}layui-btn-disabled{{#}}}" id="{{field.id}}" {{#if(field.disabled==true){}} disabled="disabled" {{#}}} data-ref="{{field.refControl}}" data-fun="{{field.action.fun}}" data-url="{{field.action.url}}" data-params='{{field.action.listPName}}' data-events="{{field.action.type}}" data-width="{{field.action.width}}" data-height="{{field.action.height}}">{{field.label}}</button>
                            {{#});}}
                        </div>
                    </script>
                    <div id="learnDirAction_actionView"></div>

                    <script type="text/html" id="barDemo">
                        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
                        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                    </script>

                    <div class="layui-fluid" id="bounced" style="display: none">
                        <form class="layui-form" lay-filter="learnDirForm">
                            <div id="view" style="display: block;margin-top: 20px">

                                <form class="layui-form" action="">
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">父级考试目录</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="sortPName" sortPName="" lay-verify="title" autocomplete="off" placeholder="请选择父级考试目录" id="tree" lay-filter="tree" class="layui-input">
                                        </div>
                                    </div>
                                </form>
                                <form class="layui-form" action="">
                                    <div class="layui-form-item">
                                        <label class="layui-form-label"><i style="color: red">*</i>项目目录名称</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="sortName" lay-verify="title" autocomplete="off" placeholder="请输入项目目录名称（字数限制在15字以内）" class="layui-input">
                                        </div>
                                    </div>
                                </form>
                                <form class="layui-form" action="">
                                    <div class="layui-form-item">
                                        <label class="layui-form-label"><i style="color: red">*</i>排序</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="sortNo" lay-verify="title" autocomplete="off" placeholder="请输入排序（0-999）" class="layui-input">
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </form>
                    </div>
                    <table id="learnDirTable" lay-filter="learnDirTable"></table>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    layui.use(['table','layer','form','eleTree','treeSelect','laytpl','jquery','element',], function(){
        var treeSelect= layui.treeSelect;
        var table = layui.table
            ,layer = layui.layer
            ,$ = layui.jquery
            ,eleTree = layui.eleTree

        // 初始化渲染 树形下拉菜单
        // 初始化渲染 树形下拉菜单
        function treeSelects(treeId,id) {
            $('.layui-treeSelect').remove();
            treeSelect.render({
                // 选择器
                elem: treeId,
                // 数据
                data: '/examTest/selectAllTree?testId=0',
                // 异步加载方式：get/post，默认get
                type: 'get',
                placeholder: '请选择父级考试目录',
                // 是否开启搜索功能：true/false，默认false
                search: true,
                click: function (d) {
                    $('#tree').attr('sortPName', d.current.id)
                    form.render()
                },
                // 加载完成后的回调函数
                success: function (d) {
                    if(id!=''&&id!=undefined) {
                        var treeId = $('.layui-treeSelect-body').attr('id')
                        treeSelect.checkNode('#tree', treeId, parseInt($('#tree').attr('sortPName')));
                    }

                },
            });
        }
        // 初始化渲染 树形菜单
        eleTree.render({
            elem: '.ele1',
            showLine:true,
            url:'/examTest/showParent',
            lazy: true,
            style: {
                folder: { // 父节点图标
                    enable: true // 是否开启：true/false
                },
                line: { // 连接线
                    enable: true // 是否开启：true/false
                }
            },
            load: function(data,callback) {
                $.post('/examTest/showChild?testId='+data.testId,function (res) {
                    callback(res.data);//点击节点回调
                })
            },
            done:function (data) {
                if(data.data.length>0){
                    aldata = data.data
                    name=data.data[0].testName //传的是默认选中的值
                    pid = data.data[0].testId;
                }

            }
        });

        var tableObj=table.render({
            elem: '#learnDirTable',
            url : '/examTest/selectAllTest?testId='+ 1,
            limit:10,
            data:[],
            cols: [[
                {type: 'checkbox', fixed: 'left',} //totalRowText:'合计'
                , {field: 'testName', title: '试卷目录名称', }
                , {field: 'testNo', title: '排序',sort:true}
                , { title: '操作',toolbar: '#barDemo' }
            ]],
            page: true,
            done: function (res) {


            }

        })

        // 节点点击事件设备
        var testId
        eleTree.on("nodeClick(data1)",function(d) {
            testId = d.data.currentData.testId
            var dataid=$('.ele1 div').attr("data-id")
            var a = d.data.currentData.id;
            $('.eleTree-node').removeClass('back')
            $(d.node[0]).addClass('back')
            $('.eleTree-node-group').css('background','#fff')
            var obj = d.data.currentData
            name = obj.sortName
            pid = obj.testId;
            idkey = obj.id;
            var currentPage = 1
            table.reload('learnDirTable',{
                url : '/examTest/selectAllTest?testId='+ testId,
            })
        });
        table.on('tool(learnDirTable)', function(obj){
            var data = obj.data;
            var testId=data.testId
            if(obj.event === 'edit'){
                $.ajax({
                    type: "post",
                    url: "/examTest/selectShowTest",
                    dataType:'json',
                    data: {
                        testId: testId,
                    },
                    success: function (data) {
                        $('[name="sortName"]').val(data.object.testName)
                        $('[name="sortNo"]').val(data.object.testNo);
                        $('#tree').attr('sortpname',data.object.testPName)
                        form.render('select')
                        treeSelects('#tree',data.object.testPName)
                        layer.open({
                            title: '编辑'
                            , type: 1
                            , maxmin: true
                            , area: ['700px', '500px']
                            , content: $('#bounced')
                            , btn: ['保存', '取消']
                            , yes: function (index, layero) {
                                var sortPName = $('#tree').attr('sortPName');
                                var sortName = $('[name="sortName"]').val();
                                if(sortName == null || sortName == ''){
                                    layer.msg("请输入项目目录名称（字数限制在15字以内）", {icon: 2, time: 2000});
                                    return;
                                }
                                var sortNo = $('[name="sortNo"]').val();
                                if(sortNo == null || sortNo == ''){
                                    layer.msg("请输入排序（0-999）", {icon: 2, time: 2000});
                                    return;
                                }
                                $.ajax({
                                    type: "post",
                                    url: "/examTest/editTest",
                                    dataType: 'json',
                                    data: {
                                        testId: testId,
                                        testPName:$('#tree').attr('sortPName'),
                                        testName:sortName,
                                        testNo:sortNo
                                    },
                                    success: function (data) {
                                        layer.closeAll();
                                        layer.msg(data.msg, {icon: 6, time: 2000})
                                        location.reload();
                                    },
                                    rror: function () {
                                    }
                                })
                            }
                        })
                    }
                })
            } else if(obj.event === 'del'){
                layer.confirm('确定删除该条数据吗？', {
                    btn: ['确定','取消'], //按钮
                    title:"删除"
                }, function(){
                    $.ajax({
                        type: "post",
                        url: "/examTest/deleteTest",
                        data:{
                            testId:obj.data.testId
                        },
                        success: function (data) {
                            layer.closeAll();
                            layer.msg('保存成功', {icon: 6, time: 2000})
                            location.reload();

                        },
                        error: function () {}
                    })
                },function(index){
                    layer.close(index);
                });
            }
        })

        "use strict";
        var laytpl = layui.laytpl,
            $ = layui.jquery
            ,form = layui.form
            ,element = layui.element
            ,$win = $(window), $body = $('body')
            ,MOD_NAME = "listaction"
            ,ListAction = function(){
                this.v = '1.0.0';
            }


        ListAction.prototype.render = function() {
            var that = this;
            //表单模板数据

            var tplData = {
                fields:[{
                    "action": {
                        "type": "add",
                        "url": "/tbExamList/subItemCatalogue"
                    },
                    "id": "addLearnDir",
                    "label": "添加考试目录",
                    "type": "button"
                }]
            }
            renderListAction(tplData);

            function renderListAction(tplData){
                var search = location.search;
                $.each(tplData.fields,function(index,item){
                    if(item.action.url){
//                                            item.action.url = CH.resolveQueryString(item.action.url,search);
                    }
                });
                //模板渲染
                var getTpl = learnDirAction_Tpl.innerHTML;
                laytpl(getTpl).render(tplData,function(html) {
                    learnDirAction_actionView.innerHTML = html;
                });
                form.render();
            }


            $('.LAY-learnDirAction-action-btns .layui-btn').on('click', function(){
                treeSelects('#tree','')
                $('[name="sortName"]').val('')
                $('[name="sortNo"]').val('')
                var othis = $(this)
                layer.open({
                    title: '新增'
                    ,type: 1
                    ,maxmin:true
                    ,area: ['700px', '500px']
                    ,content: $('#bounced')
                    ,btn: ['保存', '取消']
                    ,yes: function(index, layero) {
                        var sortPName = $('#tree').attr('sortPName');
                        var sortName = $('[name="sortName"]').val();
                        if(sortName == null || sortName == ''){
                            layer.msg("请输入项目目录名称（字数限制在15字以内）", {icon: 2, time: 2000});
                            return;
                        }
                        var sortNo = $('[name="sortNo"]').val();
                        if(sortNo == null || sortNo == ''){
                            layer.msg("请输入排序（0-999）", {icon: 2, time: 2000});
                            return;
                        }
                        $.ajax({
                            type: "post",
                            url: "/examTest/insertTest",
                            dataType:'json',
                            data: {
                                testPName:$('#tree').attr('sortPName'),
                                testName:sortName,
                                testNo:sortNo
                            },
                            success: function (data) {
                                layer.closeAll();
                                layer.msg(data.msg, {icon: 6, time: 2000})
                                location.reload();
                            },
                        })
                    }
                })
            });
        }

        var listAction = new ListAction();
        listAction.render();

        var num=$(window).height()-30
        $('.tyid').height(num)
    });
</script>
</body>
</html>